<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
request.setCharacterEncoding("utf-8");
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">    
    <link rel="stylesheet" type="text/css" href="<%=path%>/js/ext/resources/css/ext-all.css">  
	<link rel="stylesheet" type="text/css" href="<%=path%>/js/ext/resources/css/edit-grid.css">  
	<script type="text/javascript" src="<%=path%>/js/ext/adapter/ext/ext-base.js"></script>
	<script type="text/javascript" src="<%=path%>/js/ext/ext-all.js"></script>
	<script type="text/javascript" src="<%=path%>/js/ext/DWRTreeLoader.js"></script>
	<script type="text/javascript" src="<%=path%>/js/ext/SearchField.js"></script>
	<script type="text/javascript" src="<%=path%>/js/ext/query-dwr-proxy.js"></script>	
	<script type="text/javascript" src="<%=path%>/js/ext/ext-lang-zh_CN.js"></script>
	<script type='text/javascript' src='/btsm/dwr/interface/JFiberWeb.js'></script>
	<script type='text/javascript' src='/btsm/dwr/engine.js'></script>
	<script type='text/javascript' src='/btsm/dwr/util.js'></script>	 		
  </head>
<body>  

<form id="showSectionForm" action="<%=path%>/pages/fiber/FiberAndSection.jsp" enctype="multipart/form-data" >
	<input type="hidden" name="id" id="strFiberLinkID">
	<input type="hidden" name="name" id="strFiberLinkName">
</form>
<form id="showMapForm" action="<%=path%>/pages/fiber/FiberLinkMapDispatch.jsp">
	<input type="hidden" name="linkId" id="strLinkID">
</form>

<div id="fiberLinkDiv" style="width:100%;height:100%">
<script type="text/javascript">

var fiberLinkWindow;//光纤环窗口
var	ds;

Ext.form.Field.prototype.msgTarget = 'side'; 
Ext.onReady(function()
{
	 var viewport = new Ext.Viewport({
	    layout:'border',
	    frame:true,
	    items:[	    	
	    	{
		        region: 'center',
		        contentEl: 'fiberLinkDiv',
		        margins:'110 0 30 5',
		        split: true,
		        border: false	
		    }]
		});



	var btnAddFiblerLink = new  Ext.Button({
					text:'创建光纤环（段）',
					pressed:false,					 
					handler:createFiblerLink
				});
	var btnEditFiblerLink = new  Ext.Button({
					text:'修改光纤环（段）',
					pressed:false,					 
					handler:updateFiblerLink
				});	
 
	var sm = new Ext.grid.CheckboxSelectionModel({singleSelect: true});	
	var recordType = Ext.data.Record.create([								
                			   {name: 'id', type: "string"},
                	           {name: 'strFiberLinkName', type: "string"},
                	           {name: 'createTime',  type: 'string'},
                	           {name: 'updateTime',  type: 'string'}
                	     ]);

	var cm  = new Ext.grid.ColumnModel(
			[
				sm,
	            {header: "ID", width: 100, sortable: true, dataIndex: 'id',align:'left'},	            
	            {header: "光纤环（段）", width: 80, sortable: true, dataIndex: 'strFiberLinkName',align:'left'},
	            {header: "创建时间", width: 140, sortable: true, dataIndex: 'createTime',align:'left'},
	            {header: "修改时间", width: 140, sortable: true, dataIndex: 'updateTime',align:'left'},				 
				{header: "详细信息", width: 100, sortable: false, dataIndex: 'id',renderer: showSection},
				{header: "删除", width: 50, sortable: false, dataIndex: 'id',renderer: showDelete}				
			]
		);
	function showMap(id)	
	{
		return "<input type='button' value='地图' class='x-btn button' onclick='doFiberMap(\"" + id  +   "\")'>";  
	}	
	function showSection(value, cellmeta, record, rowIndex, columnIndex, store)
	{
		var name = record.get("strFiberLinkName");
		return "<input type='button' value='详细信息' class='x-btn button' onclick='doShowSection(\"" + value  +   "\",\""+name+"\")'>"; 
	}	
	function showDelete(id)
	{
		return "<input type='button' value='删除' class='x-btn button' onclick='doDeleteFiberLink(\"" + id  +   "\")'>";  
	}	
	ds = new Ext.data.Store({
        proxy: new Ext.data.DWRProxy(JFiberWeb.getFiblerLinkList, true),	
        reader: new Ext.data.ListRangeReader({
            totalProperty: 'totalSize',
            id: 'id'
        }, recordType),
        sortInfo:{field:'id', direction:'ASC'}// 排序信息
    });


	var contentDiv = Ext.get("fiberLinkDiv");
	var grid = new Ext.grid.GridPanel({
	    	el: 'fiberLinkDiv',	    	
	        ds: ds,
	        cm: cm,
			sm:sm,
			title: '光纤环（段）',
		    width: contentDiv.getComputedWidth(),
			height: contentDiv.getComputedHeight(), 
	        frame:true,
	        collapsible:false,
			autoExpandColumn:2, 
	        enableDragDrop:false, 
			tbar: [
				'查询: ', ' ',
				new Ext.ux.form.SearchField({
						store:ds,
						width:320
					}),
				btnAddFiblerLink,
				btnEditFiblerLink
				],
			bbar: new Ext.PagingToolbar({
			        pageSize: 17,
			        store: ds,
			        displayInfo: true,
			        displayMsg: '显示第 {0} 条到 {1} 条记录，一共 {2} 条',
			        emptyMsg: "没有记录"
			    })
					
				
	    });
	    
	
    grid.render();
	var strID = "0";
		
	ds.load({params:{start:0,limit:17}});
	window.onresize=function(){
		//grid.setWidth(contentDiv.getComputedWidth());
	}; 
	
	ds.on('load', function() {
		   grid.getSelectionModel().selectFirstRow(); 
		});		
	
		//文件共享form				
	var FiblerLinkForm = function(){
			this.idTextField = {
					xtype : 'hidden',
					fieldLabel : "id",
					readOnly : true,
					name : "id"
				};
						
			this.fiberLinkNameTextField = {
					xtype : 'textfield',
					fieldLabel : "光纤环(段)名称",
					allowBlank : false,
					name : "strFiberLinkName",
					width:160,
					blankText :'请输入光纤环(段)名称'	
			};					
			
			FiblerLinkForm.superclass.constructor.call(this, {
					bodyStyle : 'padding:5px 5px 0',
					frame : true,
					id: 'FiblerLinkForm',
					labelAlign: 'right',
					labelWidth:100,
					items : [this.idTextField, 
							 this.fiberLinkNameTextField
							 ]
				});	
	}	
	Ext.extend(FiblerLinkForm, Ext.form.FormPanel);
	//文件夹弹出win
	var FiberLinkWindow = function() {
		var _win = this;
		this.formPanel = new FiblerLinkForm();
		var _form = this.formPanel.getForm();
		FiberLinkWindow.superclass.constructor.call(this, {
			title : '创建/修改光纤环(段)',
			width : 300,
			height : 120,
			resizable : true,
			plain : false,
			border : false,
			modal : true,
			autoScroll : false,
			layout : 'fit',
			closeAction : 'hide',
			items : this.formPanel,
			buttonAlign:'center',
			buttons : 
			[
				{	text : ' 保存',
					handler : function() 
					{
						if (_form.isValid()) 
						{
							var form = _form.getValues(false);
							FiberLinkBO = {};
							FiberLinkBO.strFiberLinkName = form.strFiberLinkName;
							FiberLinkBO.id = form.id;						
							JFiberWeb.createFiberLink(FiberLinkBO,function(data)
							{
								if(data)
	          					{
	          						_win.hide();
	          						Ext.Msg.alert('成功',"操作成功！",function()
	          						{
										ds.load({params:{start:0,limit:17}});
	          						}); 
	          					}else
	          					{
	          						Ext.Msg.alert("失败","操作失败!");
	          					}																
							})
						}
					}
				},{
					text : '取消',
					handler : function() {
						_win.hide();
					},
					tooltip : '关闭对话框'
				}
			]	
		});
	}
	Ext.extend(FiberLinkWindow, Ext.Window);
	
	fiberLinkWindow = new FiberLinkWindow();
	
	function createFiblerLink()
	{
		var data = {'id':"",
					'strFiberLinkName':""
					};
		var record = new Ext.data.Record(data);
		fiberLinkWindow.show();
		fiberLinkWindow.formPanel.getForm().loadRecord(record);				
	}
	
	function updateFiblerLink()
	{
		var record = grid.getSelectionModel().getSelected();
		if(!record)
		{
			Ext.Msg.alert("提示","请先选择需要修改的光纤环（段）!");
			return;
		}
		fiberLinkWindow.show();
		fiberLinkWindow.formPanel.getForm().loadRecord(record);	
	}
	
})

function doDeleteFiberLink(id)
{
	Ext.MessageBox.confirm('确认删除', '确认删除该光纤环（段）?', 
		function(btn) {
		 if(btn == 'yes') // 选中了是按钮	
		 {	    	     	
			 JFiberWeb.deleteFiberLink(id, function(data) {
			 if(data) {							    	     		
				 ds.load({params:{start:0,limit:17}});
			 }else 
			 {
				Ext.Msg.alert("删除失败","数据删除失败!");
			 }
			 });
			
		 }
		});
		
}

function doShowSection(id,name)
{
	document.getElementById("strFiberLinkID").value = id;
	document.getElementById("strFiberLinkName").value = name;
	document.getElementById("showSectionForm").submit();
}

function doFiberMap(id)
{
	document.getElementById("strLinkID").value = id;
	document.getElementById("showMapForm").submit();
}

</script>
</body>
</html>